<template>
	<view>
		<view class="mt-5" v-if="u_loadmore">
			<u-loadmore status="loading" icon-type="circle" />
		</view>
		<view v-else>
			<view class="m-2 py-2">
				选择运费模板
			</view>
			<view class="mx-2 mb-2 bg-white rounded-20" v-if="template_list.data">
				<view class="ml-3" v-for="(item,index) in template_list.data" :key="index">
					<view class="border-bottom a-center  py-3 d-flex j-sb clazz template_clazz" @click="template_click(item,index)">
						<view class="">{{item.template_name}}</view>
						<view class="mr-2">
							<u-icon v-show="index==count"  name="checkmark-circle-fill" color="#f14748" size="40"></u-icon>
						</view>
					</view>
				</view>
			</view>
			<view v-else class="d-flex flex-column w-100 a-center j-center h-70">
				<image src="../../static/images/home/icon_no_data.png" mode="" class="icon_no"></image>
				<view class="">暂无模板</view>
			</view>	
			<u-toast ref="uToast" />
			<view class="footer"></view>
			<view class="bg-white release py-2 w-100 position-fixed bottom-0">
				<button type="warn" @click="next_sub">确定</button>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				template_list:"",
				count:0,
				items:"",
				u_loadmore:true, // 加载中
			}
		},
		methods: {
			template_click(item,index){
				this.count=index
				this.items=item
			},
			// 确定
			next_sub(){
				if(this.template_list.data){
					var globalData = getApp().globalData.freight_template; //获取全局变量
					getApp().globalData.freight_template= this.items; //修改全局变量
					uni.navigateBack({
						delta:2
					})
					var globalData = getApp().globalData.freight; //获取全局变量
					getApp().globalData.freight= ""; //修改全局变量
				}else{
					this.$refs.uToast.show({
						title: "您没权限进行此操作！",
						type: 'default'
					})
				}
			}
		},
		onLoad() {
			this.$H.post("admin/merchant/shipping/template/list").then(res=>{
				this.template_list=res
				if(res.status.succeed!=1){
					this.$refs.uToast.show({
						title: "您没权限进行此操作！",
						type: 'default'
					})
				}
				this.u_loadmore=false 
			})
		}
	}
</script>

<style>
	.footer{
		height: 145upx;
	}
	.release{
		z-index: 22;
	}
	.release /deep/ button{
		width: 85%;
		border-radius: 50upx;
		background: linear-gradient(to right,#F31E3E,#FB4F37);
	}
	.icon_no{
		width: 350upx;
		height: 350upx;
	}
</style>
